<template>
  <div class="privacy-page">
    <div class="container">
      <h1 class="page-title">隐私政策</h1>
      <div class="privacy-content">
        <h2>1. 信息收集</h2>
        <p>1.1 为了向您提供更好的服务，我们可能收集以下信息：</p>
        <ul>
          <li>账户信息（如用户名、手机号、邮箱等）</li>
          <li>身份认证信息</li>
          <li>交易信息</li>
          <li>使用记录</li>
          <li>设备信息</li>
        </ul>

        <h2>2. 信息使用</h2>
        <p>2.1 我们收集的信息将用于：</p>
        <ul>
          <li>提供、维护和改进我们的服务</li>
          <li>处理您的请求和订单</li>
          <li>向您发送服务通知</li>
          <li>防范安全风险</li>
        </ul>

        <h2>3. 信息共享</h2>
        <p>3.1 我们不会向第三方出售您的个人信息。</p>
        <p>3.2 在以下情况下，我们可能会共享您的信息：</p>
        <ul>
          <li>获得您的明确同意</li>
          <li>法律法规要求</li>
          <li>维护本平台及用户的合法权益</li>
        </ul>

        <h2>4. 信息安全</h2>
        <p>4.1 我们采取多种安全措施保护您的个人信息：</p>
        <ul>
          <li>数据加密存储</li>
          <li>严格的访问控制</li>
          <li>定期安全评估</li>
        </ul>

        <h2>5. Cookie的使用</h2>
        <p>5.1 我们使用Cookie来改善您的浏览体验。</p>
        <p>5.2 您可以通过浏览器设置管理Cookie。</p>

        <h2>6. 隐私政策的变更</h2>
        <p>6.1 我们可能会适时修改本隐私政策。</p>
        <p>6.2 对于重大变更，我们会通过显著方式通知您。</p>

        <h2>7. 联系我们</h2>
        <p>如果您对本隐私政策有任何疑问，请通过以下方式联系我们：</p>
        <ul>
          <li>电子邮件：privacy@bmark.cn</li>
          <li>客服电话：400-000-0000</li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
import { defineComponent } from 'vue';

export default defineComponent({
  name: 'Privacy'
});
</script>

<style scoped lang="scss">
.privacy-page {
  padding: $spacing-extra-large 0;
  background-color: $background-color-base;
}

.container {
  max-width: $container-width;
  margin: 0 auto;
  padding: $spacing-extra-large;
  background-color: $background-color-white;
  border-radius: $border-radius-base;
  box-shadow: $box-shadow-light;
}

.page-title {
  font-size: $font-size-extra-large;
  color: $text-primary;
  margin-bottom: $spacing-extra-large;
  text-align: center;
}

.privacy-content {
  h2 {
    font-size: $font-size-large;
    color: $text-primary;
    margin: $spacing-extra-large 0 $spacing-base;
  }

  p {
    color: $text-regular;
    line-height: 1.6;
    margin-bottom: $spacing-base;
  }

  ul {
    list-style-type: disc;
    padding-left: $spacing-large;
    margin-bottom: $spacing-base;
    color: $text-regular;

    li {
      margin-bottom: $spacing-small;
    }
  }
}

@media screen and (max-width: 768px) {
  .container {
    padding: $spacing-large;
  }
}
</style> 